/** 拟态框 */

/**
 * 提示框 有文字长度限制 20
 * @param {Object} option
 * @param {Object} option.title 提示的内容
 * @param {Object} option.icon 图标
 * @param {Object} option.image 自定义图标的本地路径
 * @param {Object} option.mask 是否显示透明蒙层
 * @param {Object} option.duration 提示的延迟时间
 */
const TOAST_OPTION = {
    title: "",
    icon: "none",
    image: "",
    mask: true,
    duration: 1500,
    position: 'bottom'
}

/**
 * 模态框
 * @param {Object} option
 * @param {string} option.title 标题
 * @param {boolean} option.showCancel 是否显示取消按钮
 * @param {string} option.cancelText 取消按钮文字
 * @param {string} option.cancelColor 取消按钮颜色
 * @param {string} option.confirmText 确认按钮文字
 * @param {string} option.confirmColor 确认按钮颜色
 * @param {boolean} option.editable 是否显示输入框
 * @param {string} option.placeholderText 输入框文本内容占位
 */
const MODAL_OPTION = {
    title: "温馨提示",
    showCancel: true,
    cancelText: "否",
    cancelColor: "#999",
    confirmText: "是",
    confirmColor: process.env.VUE_APP_THEME_COLOR,
    editable: false,
    placeholderText: "请输入",
}


class Modal {

    /**
     * 提示框 无icon 图标
     */
    toast(title, option) {
        uni.showToast({...TOAST_OPTION, title, ...option,});
    }

    /**
     * 错误提示框
     */
    error(title, option) {
        this.toast(title, {icon: 'error', ...option,});
    }

    /**
     * 成功提示框
     */
    success(title, option) {
        this.toast(title, {icon: 'success', ...option,});
    }

    /**
     * 待确认的弹窗
     */
    confirm(content, option) {
        return new Promise((resolve, reject) => {
            uni.showModal({
                ...MODAL_OPTION,
                content,
                ...option,
                success: (res) => {
                    if (res.confirm) {
                        resolve(true);
                    } else {
                        resolve(false);
                    }
                },
            });
        });
    }

    /**
     * 带输入框弹窗
     */
    edit(title, option) {
        return new Promise((resolve, reject) => {
            uni.showModal({
                ...MODAL_OPTION,
                title,
                editable: true,
                ...option,
                success: (res) => {
                    if (res.confirm) {
                        resolve(res.content);
                    }
                },
            });
        });
    }
}

export default new Modal();